<template>
  <div class="content">
    <div
      v-for="notification in lister"
      :key="notification.id"
      class="notification-item"
    >
      <el-link
        :underline="false"
        @click="viewNotification(notification.noticeId)"
      >
        <span style="font-size: 14px;color:#1571FA">【{{ notification.noticeTypeName }}】</span>
        <span style="font-size: 14px;">{{ notification.title }}</span>
      </el-link>
      <span style="font-size: 14px; color: #aeb0b4;">{{ notification.createDate }}</span>
    </div>
  </div>
</template>

<script>
// import init from './mixins/init'
export default {
  name: 'Notification',
  props: {
    lister: {
      type: Array,
      default: undefined
    }
  },
  data() {
    return {
      loading: false,
      notifications: []
    }
  },
  methods: {
    viewNotification(id) {
      this.$emit('add-data')
      this.$emit('view-detail', id)
    }
  }
}
</script>

<style lang="scss" scoped>
.notification {
  width: 100%;
  & >>> .el-card__header {
    padding: 5px 10px;
  }
  .header {
    color: #409eff;
  }
}
.notification-item {
  height: 10%;
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
}
.content {
  height: 90% !important;
}
</style>
